import React, {useReducer} from 'react'
import {MdContainer} from './components/MdContainer'
import {InputArea} from './components/InputArea'
import {RenderArea} from './components/RenderArea'
import {mdReducer} from './util/mdReducer'
import {MDSET} from './util/mdReducer'
import {paragraphSplit} from './util/mdParser'

function App() {
  const [state, dispatch] = useReducer(mdReducer, {text: ''})

  function setMdValue (value: string) {
    dispatch({type: MDSET, payload: value})
  }

  return (
    <MdContainer>
      <InputArea setValue={setMdValue}></InputArea>
      <RenderArea mdText={state.text}></RenderArea>
    </MdContainer>
  )
}

export default App
